{include file="public/head" /}


<link rel="stylesheet" type="text/css" href="/public/static/index/layui/css/layui.css" media="all"/>

<style>
  .box{
    margin: 50px;
  }
  .img_box{
    border: 1px dashed #ddd;
    margin-bottom: 30px;
    width: 101px;
    height: 101px;
    position: relative;
  }
  .img_box  img{
    width: 100px;
    height: 100px;
  }
  .del{
    display: none;
    position: absolute;
    bottom: 0;
  }
</style>

<div class="box">
  <div class="img_box">
    <img src="/public/static/index/images/thumb.jpg" />
    <input type="hidden" value="">
    <div class="del" onclick="delImg()">删除</div>
  </div>
  
  <button type="button" class="layui-btn" id="test1">
    <i class="layui-icon">&#xe67c;</i>上传图片
  </button>
</div>

<script>
  layui.use('upload', function(){
    var upload = layui.upload;
     
    //执行实例
    var uploadInst = upload.render({
      elem: '#test1' //绑定元素
      ,url: '/index.php/qingadmin/uploader/local_upload' //上传接口
      ,done: function(res){
        //上传完毕回调
        $(".img_box").children('img').attr('src',res.message);
        $(".img_box").children('input').val(res.message);
        $(".img_box").children(".del").css("display","block")
      }
      ,error: function(){
        //请求异常回调
      }
    });
  });



  //删除图片逻辑
  function delImg(){
    //先获取路径，再post到remove_img
  }
  </script>




{include file="public/foot" /}



</body>

</html>